import React, { Component } from 'react'

export default class RefCom extends Component {
  // 1. 创建容器
  input = React.createRef(); 
  div = React.createRef();

  //声明事件会回调
  send = () => {
    //3. 使用 input 属性获取真实 DOM 元素  current 当前的
    let v = this.input.current.value;
    this.div.current.innerHTML = v;
  } 

  render() {
    return (
      <div>
        {/* 2. 设置元素的 ref 值 */}
        <input ref={this.input} type="text" /><button onClick={this.send}>发送</button>
        <hr />
        <div ref={this.div} style={{
          width: 400,
          height: 300,
          border: 'solid 1px #234'
        }}></div>
      </div>
    )
  }
}
